<template>
  <div class="title jCusTitle">
    <div class="mainTitle"><slot name="mainTitle"></slot></div>
    <div class="underline"></div>
    <h3 class="mainInfo"><slot name="mainInfo"></slot></h3>
  </div>
</template>

<script></script>

<style lang="scss">
.jCusTitle {
  display: flex;
  text-align: center;
  margin-top: -1.5rem;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
}
.mainTitle {
  color: #434343;
  font-size: 3rem;
  line-height: 72px;
  letter-spacing: 0.18em;
  font-family: "MyriadPro-LightCond" !important;
  font-weight: 100;
  font-stretch: ultra-condensed;
  width: 100%;
  text-align: center;
}
.underline {
  background: #b61114;
  margin: 0.5rem auto 1rem;
  width: 2.6rem !important;
  height: 0.15rem;
}
.mainInfo {
  margin: 0 !important;
  color: #434343;
  font-weight: 300;
  border-bottom: 0.1rem solid #bfbfbf;
}
</style>
